<template>
  <view class="white-contanier">
    <view class="top-search">
      <top-search :maxlength="8" :showState="true" :showMore="false" :showCarNo="false" :showCustomer="false"
        :showSearch="false" :placeholder="'请输入司机车牌号'" @bindChange="confirmChange"></top-search>
    </view>
    <view class="whitelist-box">
      <view v-for="(itemList,listIndex) in dataslist" @click="itemClick(itemList.path)" :key="listIndex">
        <view class="white-content">
          <view class="top">
            <view class="cname-box">
              <view class="cname">{{ itemList.driverCarBrand || ''}}</view>
            </view>
          </view>
          <view class="body-box">
            <view class="bottom">
              <view class="items full">
                <text class="til">客户</text>
                <text class="val">{{ itemList.cusName || '-'}}</text>
              </view>
            </view>
            <view class="bottom" v-if="orgNameShow">
              <view class="items full">
                <text class="til">所属组织</text>
                <text class="val">{{ itemList.organizationName || '-'}}</text>
              </view>
            </view>
            <view class="bottom">
              <view class="items full">
                <text class="til">煤种</text>
                <text class="val">{{ itemList.proName || '-'}}</text>
              </view>
            </view>
            <view class="bottom">
              <view class="items full">
                <text class="til">姓名</text>
                <text class="val">{{ itemList.driverName || ''}}</text>
              </view>
            </view>
            <view class="bottom">
              <view class="items full">
                <text class="til">身份证号</text>
                <text class="val">{{ itemList.driverCarCard || ''}}</text>
              </view>
            </view>
            <view class="bottom">
              <view class="items full">
                <text class="til">卸货地址</text>
                <text class="val">{{ itemList.cusAdress || ''}}</text>
              </view>
            </view>
            <view class="bottom">
              <view class="items full">
                <text class="til">开始时间</text>
                <text class="val">{{ itemList.effectStartTime || ''}}</text>
              </view>
            </view>
            <view class="bottom">
              <view class="items full">
                <text class="til">结束时间</text>
                <text class="val">{{ itemList.effectEndTime || ''}}</text>
              </view>
            </view>
          </view>
          <view class="bottom-body">
            <button class="button-hover" @click="deleteFun(itemList.id)" size="mini" type="danger">
              删除
            </button>
          </view>
        </view>
      </view>
      <uni-load-more :status="isMore" />
    </view>

    <view class="button-btn-box">
      <button class="button-hover" @click="newOneFun" type="primary">
        新增白名单
      </button>
    </view>
  </view>
</template>

<script>
  import config from '@/config';
  import { getBasisDeploy } from "@/api/system/user.js"
  import { toast } from '@/utils/common';
  import { getTenantId } from '@/utils/auth';
  import { getLists, deletelist } from '@/api/whiteList.js';
  export default {
    name: "whitelist",
    data() {
      return {
        dataslist: [],
        orgNameShow: false,
        isMore: 'more',
        queryData: {
          pageNo: 1,
          pageSize: 10,
          driverCarBrand: undefined
        }
      }
    },
    computed: {
    },
    onPullDownRefresh() {
      this.getDatas();
    },
    onReachBottom() {
      if (this.isMore == 'more') {
        this.queryData.pageNo++;
        this.getDatas();
      }
    },
    async onShow() {
      let res = await getBasisDeploy(getTenantId())
      if (res.code == 200) {
        this.orgNameShow = res?.data?.isEnabledOrganization === 1 ? true : false
      }
      this.getDatas();
    },
    methods: {
      confirmChange(data) {
        this.queryData.driverCarBrand = data.vehicleNo || undefined;
        this.getDatas();
      },
      async deleteFun(id) {
        uni.showModal({
          title: '提示',
          content: '确定删除所选的白名单车辆？',
          success: async (suc) => {
            if (suc.confirm) {
              const res = await deletelist(id)
              if (res.code == 0) {
                toast('删除成功');
                this.getDatas()
              }
            }
          }
        });
      },
      async getDatas() {
        const res = await getLists(this.queryData)
        if (res.code == 0) {
          this.dataslist = res.data?.list || []
          let total = res.data.total || 0
          if (total == this.dataslist.length) {
            this.isMore = 'noMore';
          } else {
            this.isMore = 'more';
          }
          wx.hideNavigationBarLoading();
          wx.stopPullDownRefresh();
        }
      },
      itemClick(path) {
        this.$tab.navigateTo(`/packageA/pages/${path}/index`);
      },
      newOneFun() {
        uni.navigateTo({
          url: `/packageA/pages/whiteList/newOne`
        });
      }
    }
  }

</script>

<style lang="scss" scoped>
  .white-contanier {
    padding-top: 20rpx;

    .whitelist-box {
      padding: 20rpx 0 150rpx 0;
    }
  }
</style>